import React, { Component } from 'react'
import _ from 'lodash'
import cs from 'classnames'
import moment from 'moment'

import {
  Modal
} from 'antd'

import { formatTitle } from 'config/title'
import { timeFormat } from 'config/time'

import style from './index.less'

class App extends Component {
  render () {
    const {
      onOk = f => f,
      onCancel = f => f,

      /**
       * [payWay 支付方式]
       * @type {String}
       *       1: pos收款 (二维码)
       *       2: 线下收款
       *       3: 线上收款 (在线支付)
       */
      payWay,
      // 定金
      stationaryMoney,

      excelRoomStr,

      propertyName,
      housePreiodName,
      buildNumName,
      floor,
      householdNo,

      manageEndDate,

      children,

      ...rest
    } = this.props

    let mTime = moment(manageEndDate)

    let title1 = ''
    let title2 = ''

    if (_.isString(excelRoomStr)) {
      const arr = excelRoomStr.split('-')

      title1 = arr.slice(0, 2).join('-')
      title2 = arr.slice(2).join('-')
    }

    let tip = (
      mTime.isValid() ?
        <div className = { style['tip'] }>请务必在{ mTime.format(timeFormat()) }前<br />到售楼处办理认购，过时则 视为订单无效</div> :
        <div className = { style['tip'] }>请到售楼处办理认购</div>
    )

    if (payWay === '3') {
      tip = (
        <div className = { style['tip-pay'] }>
          {
            mTime.isValid() ?
              <p>请务必在{ mTime.format(timeFormat()) }前完成订单支付</p> :
              <p>请完成订单支付</p>
          }
          <h3>定金:{ stationaryMoney }元</h3>
        </div>
      )
    }

    return (
      <Modal
        wrapClassName = { style['modal'] }
        footer = { null }
        closable = { false }
        onCancel = { onCancel }
        centered

        { ...rest }
      >
        <h1>恭喜选中</h1>
        <div className = { style['box'] }>
          <p>
            {
              title1 ?
                title1 :
                formatTitle({ propertyName, housePreiodName })
            }
          </p>
          <h2>
            {
              title2 ?
                title2 :
                formatTitle({ buildNumName, floor, householdNo })
            }
          </h2>
        </div>
        { tip }
        <div className = { style['ok'] } type = 'primary' onClick = { onOk }>
          { payWay === '3' ? '去支付' : '确定' }
        </div>
      </Modal>
    )
  }
}

Object.assign(App, Modal)

export default App
